<template>
  <div class="defaultLayout">
    <flex-header />
    <Nuxt />
  </div>
</template>

<script>
import header from '@/components/Header.vue'

export default {
  components: {
    FlexHeader: header
  },
  mounted() {
    this.$api.dashBoard.startCapture().then((res) => {}, (error) => {}).catch((error) => {})
    window.addEventListener('beforeunload',(e)=>this.$api.stopCapture().then((res)=>{},(error)=>{}).catch((error)=>{}))
  },
}
</script>

<style>
html {
  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  word-spacing: 1px;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  box-sizing: content-box;

  --dark-blue: rgb(17, 19, 60);
  --light-blue-alpha: rgba(28, 33, 89, 0.8);
  --header-height: 10vh;
  --light-font-white: rgb(255, 255, 255);
  --light-font-grey: rgba(255, 255, 255, 0.8);
  --light-font-blue: #2f56fb;
  --light-font-red: #e4284e;
  --light-font-green: #32b295;
}

*,
*::before,
*::after {
  box-sizing: content-box;
  margin: 0;
}

.defaultLayout {
  min-height: calc(100vh - var(--header-height));
  padding: var(--header-height) 0 0 0;
  background-color: var(--dark-blue);
}

</style>
